<template>
	<view class="container">
		<view class="title">引用自定义组件</view>
		<view v-for="(data, index) in datalist" :key="index" class="card-item">
			<CustomTextView
				:title="data.title" 
				:isTop="data.isTop"
				:author="data.author"
				:comments="data.comments"
				:time="data.time"
				:mode="data.mode"
				:imageSrc="data.imageSrc"
				:errorImage="'/static/xw4.png'"
				:type="data.type"
				
				:adTitle="data.adTitle"
				:adImages="data.adImages"
				:adSource="data.adSource"
				:adTime="data.adTime"

			>
			</CustomTextView>
		</view>
	</view>
</template>

<script>
	import CustomTextView from "../../components/cardViewText.vue"
	import data from "../../data/newsw.json"
	export default {
		components:{
			CustomTextView
		},
		data() {
			return {
				datalist:null
			}
		},
		onLoad(){
			this.datalist=data.datalist
		},
		methods: {
			
		}
	}
</script>

<style scoped>
	.container {
		padding: 16px;
		background-color: #f5f7fa;
		min-height: 100vh;
		box-sizing: border-box;
	}
	
	.title {
		font-size: 20px;
		font-weight: bold;
		color: #333;
		margin-bottom: 20px;
		padding-bottom: 10px;
		border-bottom: 1px solid #eee;
	}
	
	.card-item {
		margin: 10px 0;
		transition: transform 0.3s ease, box-shadow 0.3s ease;
	}
	
	.card-item:hover {
		transform: translateY(-3px);
	}
</style>
    
  